<template>
    <NuxtLink class="py-4 hover:shadow-xl global-text" :to="link.url">
        <div class="flex items-center justify-between space-x-3 bg-gray-300 dark:bg-gray-700 rounded-lg p-4">
            {{ link.title }}
        </div>
    </NuxtLink>
</template>

<script lang="ts">
import { NuxtLink } from "#components";
import { defineNuxtComponent } from "#app";
import { link } from "~~/types";
export default defineNuxtComponent({
  transition: 'bounce',
  components: {
    NuxtLink,
  },
  props: {
    link: {
      type: Object as () => link,
      required: true,
    },
  },
  setup() {
    return {};
  },
});
</script>
